<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta charset="utf-8">
	<title>注册</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<meta name="author" content="">
	<link href="css/daterangepicker.min.css" rel="stylesheet">
	<link rel="stylesheet" href="css/main_1.css">
	<!--[if lt IE 9]>
	<script src="js/html5shiv.min.js"></script>
	<script src="js/respond.min.js"></script>
<![endif]-->
	<meta name="renderer" content="webkit">
	<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<link rel="stylesheet" href="css/common.css">
	<style>
		.el-dialog__header{
			padding:0!important;
		}
		.xieyiBtn{
			height: 45px;
			line-height: 45px;
			padding: 0 10px;
			width:60%;
			border-radius: 5px;
			border: #007AFF 1px solid;
			text-align: center;
			background-color: #007AFF;
			color: #fff;
			margin:25px auto 0 auto;
		}
	</style>
</head>


<body>
	<div id="register" v-cloak>
		<header>
			<div class="content">
				<div class="left"><a href="./06.html" class="logo">长海招聘</a></div>
				<div class="right">
					<div class="user">
						<a href="01.html">登录/注册 <img src="images/face.jpg" alt="" class="face"></a>
					</div>
				</div>
			</div>
		</header>

		<section class="section11">
			<div class="box">
				<div class="left">
					<img src="images/img11.png" alt="" class="cover">
				</div>
				<div class="right">
					<div class="hd">
						<a href="" :class="{'on':active==1}" @click="changeTab($event,1)"> 个人用户 </a>
						<a href="" :class="{'on':active==2}" @click="changeTab($event,2)"> 企业用户</a>
					</div>

					<div class="bd">
						<div class="bd-con">
							<form id="signupForm">
								<ul class="form">
									<li><input type="text" placeholder="请输入手机号" class="input" id="mobile" name="mobile" v-model="mobile">
									</li>
									<li><input type="text" v-model="code" placeholder="请输入验证码" class="input ignore" id="code"
											name="code"><span style="cursor:default" class="btn-yzm" @click="sendCode">获取验证码</span></li>
									<li><input type="password" v-model="password" name="password" id="password" class="input ignore"
											placeholder="请输入6~16位字母加数字"></li>
									<li><input type="password" v-model="againPassword" name="againPassword" id="againPassword"
											class="input ignore" placeholder="请再次输入密码"></li>
									<li>
										<input type="submit" value="注册" class="btn btn-submit" @click="register($event)">
									</li>
								</ul>
							</form>
							<div class="other">
								<a @click="toLogin" class="blue">登录</a>
							</div>
						</div>
						<div class="bd-con">
							<ul class="form">
								<li><input type="text" placeholder="请输入手机号企业用户" class="input"></li>
								<li><input type="text" placeholder="请输入验证码" class="input"><a href="" class="btn-yzm">获取验证码</a></li>
								<li><input type="password" name="" id="" class="input" placeholder="请输入6~16 位字母加数字"></li>
								<li><input type="password" name="" id="" class="input" placeholder="请再次输入密码"></li>
								<li>
									<input type="submit" value="注册" class="btn btn-submit">
								</li>
							</ul>
							<div class="other">
								<a @click="toLogin" class="blue">登录</a>
							</div>
						</div>
					</div>
					<div class="tips">
						<el-checkbox label="" v-model="checked2" style="margin-right:5px;"></el-checkbox>登录注册即同意<a href="./03.html" class="blue">《用户协议》</a>
					</div>
				</div>
			</div>
		</section>
		<el-dialog :visible.sync="dialogTableVisible" :show-close="false">
			<div class="ruzhuText">欢迎申请入驻人员招聘企业</div>
			<h2 style="margin-top:15px;margin-bottom:10px;color:#000;">请您认真阅读以下使用协议</h2>
			<div v-html="xieyi.desc"></div>
			<div class="xieyiBtn" @click="agreeXieyi">我已阅读并同意</div>
		</el-dialog>
		<footer>
			<div class="content">
				<div class="menu">
					<a href="20.html">联系我们</a>
					<a href="23.html">意见反馈</a>
					<a href="24.html">关于我们</a>
				</div>
				<div class="cpt">
					Copyright &#169 2019 人员招聘 ICP备14013400号-1京ICP证150920号 电子营业执照 <a href="">京公网安备11010502031234</a> 首都网警 <a
						href="">人力资源服务许可证</a>
				</div>
			</div>
		</footer>
	</div>
	<script src="js/jquery.min.js"></script>
	<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
	<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
	<script src="js/common.js"></script>
	<script src="js/slide.min.js"></script>
	<script src="js/polyfill.min.js"></script>
	<script src="js/jquery.nicescroll3.7.6.min.js"></script>
	<!-- <script src="js/main.js"></script> -->
	<script src="js/vue.js"></script>
	<script src="js/lcommon.js"></script>
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<script src="js/request.js"></script>
	<script>
		jQuery.validator.addMethod("isMobile", function (value, element, param) {
			var regex = /^1[3|4|5|7|8]\d{9}$/;
			return regex.test(value)
		}, "请输入正确的手机格式！");
		jQuery.validator.addMethod("someData", function (value, element, param) {
			console.log($(element).attr("name"))
			if ($(element).attr("name") == 'password') {
				return value == $('#againPassword').val()
			} else if ($(element).attr("name") == 'againPassword') {
				return value == $('#password').val()
			}
		}, "两次输入的密码必须一致！");
		var vm = new Vue({
			el: '#register',
			data: {
				active: GetRequest()&&GetRequest().active?GetRequest().active:1,
				mobile: '',
				code: '',
				password: '',
				againPassword: "",
				time: 0,
				checked2:true,
				dialogTableVisible:false,
				xieyi:''
			},
			mounted() {
				var that = this
				$("#signupForm").validate({
					rules: rules,
					messages: messages
				});
			},
			methods: {
				toLogin:function(){
					location.href="./01.html?active="+this.active
				},
				changeTab: function (e, num) {
					e.preventDefault()
					if (num == this.active) {
						return false
					}
					this.active = num
					clearYzm($('.btn-yzm'))
				},
				sendCode: function () {
					var that = this
					if ($(".btn-yzm").hasClass("disabled")) {
						return false
					}
					$.validator.setDefaults({
						ignore: ".ignore"
					})
					var flag = $("#mobile").valid();
					if (flag) {
						var url = this.active == 1 ? 'person/user/sms' : 'enterprise/user/sms'
						// type 1 为登录 2 为注册 3 为忘记密码
						request(url, 'POST', JSON.stringify({ account: this.mobile, type: 2 }), function (res) {
							timeClock($(".btn-yzm"));
							that.$message.success(res.message);
						}, function (err) {
							that.$message.error(err.message);
						})
					}
				},
				isPhone: function (phone) {
					var regex = /^1[3|4|5|7|8]\d{9}$/;
					return regex.test(phone)
				},
				register: function (e) {
					e.preventDefault()
					var flag = $("#signupForm").valid(), that = this
					if(!this.checked2){
						that.$message.error("请同意注册协议");
						return false
					}
					if (flag) {
						request('common/get/base', 'GET',{type:4}, function (res) {
							that.xieyi = res.data
							that.dialogTableVisible = true
						}, function (err) {
							that.$message.error(err.responseJSON.message);
						})
						
					}
				},
				agreeXieyi:function(){
					var that = this,isUser = this.active == 1
					var url = isUser ? 'person/user/register' : 'enterprise/user/register'
					var loginData = JSON.stringify({ account: this.mobile, password: this.password, type: isUser ? 1 : undefined })
					request(url, 'POST', JSON.stringify({ account: this.mobile, password: this.password, code: this.code }), function (res) {
						that.$message.success(res.message);
						login({
							data: loginData,
							isUser: isUser
						})
						// setTimeout(function () {
						// 	location.href = "./01.html"
						// }, 800)
					}, function (err) {
						that.$message.error(err.responseJSON.message);
					})
				}

			},
		})
	</script>
</body>

</html>